<!-- Replace the TITLE of template base.html -->
{% extends "base.html" %}
{% block title %}JmilkFan's Blog{% endblock %}

<!-- Replace the BODY of template base.html -->
{% block body %}
<!-- The data object from view function: `home()` -->
<div class="row">
  <div class="col-lg-9">

    <!-- Flask-Youku setup the templates_golbal -->
    {{ youku("XMTg1NTY2MTY1Ng==") }}

    <!-- Get Pagination object-->
    {% for post in posts.items %}
    <div class="row">
      <div class="col-lg-9">
        <h1>{{ post.title }}</h1>
      </div>
    </div>
    <div class="row">
      <div class="col-lg-9">
        {{ post.text | truncate(255) | safe }}
        <!-- Set the link for read more -->
        <a href="{{
          url_for('blog.post', post_id=post.id)
          }}">Read More</a>
      </div>
    </div>
    {% endfor %}
  </div>

  <div class="col-lg-3">
    <div class="row">
      <h5>Recent Posts</h5>
      <ul>
        {% for post in recent %}
        <!-- Set the link for recent posts. -->
        <li><a href="{{
          url_for('blog.post', post_id=post.id)
          }}">{{ post.title }}</a></li>
        {% endfor %}
      </ul>
    </div>
    <div class="row">
      <h5>Popular Tags</h5>
      <ul>
        {% for tag in top_tags %}
        <li><a href="{{
          url_for('blog.tag', tag_name=tag[0].name)
          }}">{{ tag[0].name }}</a></li>
        {% endfor %}
      </ul>
    </div>
  </div>
</div>
<div class="row">
  <!-- Call the Macro: `render_pagination` from base.html -->
  {{ render_pagination(posts, 'blog.home') }}
</div>
{% endblock %}
